<template>
   <div class="con">
        
    
      <div class="con_list" v-for="item in reyingList" :key="item.id">
            <div class="con_list_a">
              
               <img :src="item.img" alt="">
            </div>
         <div class="con_list_b">
            <p class="p1">{{item.nm}}</p>
            <p class="p2">评分 <span>{{item.sc}}</span></p>
            <p class="p3">主演：{{item.star}}</p>
            <p class="p4">{{item.showInfo}}</p>
         </div>
         <div></div>
         <div></div>
         <div class="con_list_c">
            <div v-if="item.preShow" class="btn ysbtn">预售</div>
            <div v-else class="btn gpbtn">购票</div>
         </div>
        </div>`
    
             
  </div>
                   
</template>

<script>
 
export default {
    props: ["reyingList"],
  name:"mycon"
  
}
</script>

<style scoped>
    .con{
        margin-top: 1.333333rem ;
    }
   .con_list {
         width: 100%;
         height: 3.04rem;
         border-bottom: .026667rem solid #777;
         display: flex;
         justify-content: space-between;
         /* margin-top:  1.333333rem; */
      }

      .con_list_a {
         margin-left: .266667rem;
         display: flex;
         justify-content: space-between;
         align-items: center;
      }

      .con_list_a img {
         width: 1.706667rem;
         height: 2.4rem;
      }

      .con_list_c {
         margin-left: .266667rem;
         display: flex;
         justify-content: space-around;
         align-items: center;
         margin-right: .266667rem;
      }

      .con_list_c div {
         width: 1.253333rem;
         height: .72rem;
         color: #fff;
         border-radius: 5px;
         line-height: .72rem;
         text-align: center;
         font-size: .32rem;
         
      }

      .con_list_c .gpbtn {
         background: #f03d37;
      }

      .con_list_c .ysbtn {
         background: #3c9fe6;
      }

      .p1 {
         margin-top: 5%;
         font-size: .453333rem;
         color: #333;
         font-weight: bold;
         width: 5.333333rem;
      }


      .p2 span {
         font-size: .426667rem;
         color: #faaf00;
         display: inline-block;
      }

      .p2,
      .p3,
      .p4 {
         font-size: .373333rem;
         color: #777;
         text-overflow: ellipsis;
         overflow: hidden;
         white-space: nowrap;
         margin-top: 2%;
         width: 5.333333rem;
      }
</style>